@use 'src/styles/abstracts' as *;

.ResizePanel {
  cursor: row-resize;
  justify-content: center;
  display: flex;
  align-items: center;
  height: toRem(4px);
  transition: all 0.15s ease-out 0.2s;
  background-color: transparent;
  box-shadow: inset 0 2px 0 0 $primary-color-20;
  &:hover,
  &:active,
  &.resizing {
    background-color: $primary-color-50;
    box-shadow: unset;
  }
  &__fullHeight {
    background-color: $cuddle-10;
    border-top: $border-main;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  &__hidden {
    display: none;
  }
}
